@import "tailwindcss";

/* 全局基础样式 */

/* Firefox渲染优化 */
@-moz-document url-prefix() {
  /* 应用硬件加速到所有动画元素 */
  .el-menu,
  .el-menu-item,
  .el-sub-menu,
  .el-tabs__item,
  .el-tabs__nav,
  .sidebar,
  .main-container,
  .navbar,
  .app-main {
    transform: translateZ(0);
    backface-visibility: hidden;
    will-change: transform;
  }
  
  /* 优化滚动性能 */
  body {
    scrollbar-width: thin;
  }
  
  /* 减少重绘区域 */
  .el-menu-vertical {
    contain: content;
  }
  
  /* 优化过渡动画 */
  .sidebar {
    transition: width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
  }
  
  /* 防止某些元素的闪烁 */
  .el-tabs__nav-wrap::after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: var(--el-border-color-light);
    z-index: 1;
    transform: translateZ(0);
  }
}

/* 通用样式 */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', Arial, sans-serif;
}

#app {
  height: 100%;
}

/* 去除按钮点击时的蓝色边框 */
button:focus {
  outline: none;
}

/* 链接样式 */
a {
  text-decoration: none;
  color: #409EFF;
}

/* 过渡效果 */
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}